<script setup lang="ts">
import PersonInfo from './components/PersonInfo.vue'
import PersonAdvantage from './components/PersonAdvantage.vue'
import PositionType from './components/PositionType.vue'
import ExcellentSkill from './components/ExcellentSkill.vue'
import WorkExperience from './components/WorkExperience.vue'
import ProjectExperience from './components/ProjectExperience.vue'
import EducationalExperience from './components/EducationalExperience.vue'
import {getResume} from '@/api/Resume'
import {computed, onMounted, reactive, ref} from "vue";

const leftBack = () => history.back();
let resumeInfo = reactive<any>({
  advantage: ""
})
onMounted(() => {
  getResume().then(res => {
    Object.assign(resumeInfo, res.data)
    resumeInfo.workEx = JSON.parse(resumeInfo.workExperience)
    resumeInfo.projectEx = JSON.parse(resumeInfo.projectExperience)
    resumeInfo.eduEx = JSON.parse(resumeInfo.educations)
    console.log(resumeInfo)
  })
})
</script>
<template>
  <van-nav-bar title="我的简历" left-arrow @click-left="leftBack"/>
  <div class="resume">
    <PersonInfo></PersonInfo>
    <PersonAdvantage :advantage-info="resumeInfo.advantage"></PersonAdvantage>
<!--    <PositionType></PositionType>-->
<!--    <ExcellentSkill></ExcellentSkill>-->
    <WorkExperience :workEx="resumeInfo.workEx"></WorkExperience>
    <ProjectExperience :projectEx="resumeInfo.projectEx"></ProjectExperience>
    <EducationalExperience :eduEx="resumeInfo.eduEx"></EducationalExperience>
  </div>
</template>
<style scoped>
.resume {
  height: calc(100vh - 46px - 3rem);
  overflow: auto;
}

.resume-btn {
  height: 2.35rem;
  background: linear-gradient(90deg, #FEA829, #FE8F27);
  border-radius: 0.27rem;
  margin: 0 0.64rem 0.64rem;
  position: fixed;
  bottom: 0;
  left: 0;
  width: calc(100vw - 1.28rem);
  border: none;
  font-size: 0.8rem;
  font-weight: 400;
  color: #FFFFFF;
}
</style>